<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            margin:0;
            padding:0;
        }
        #id{
            width: 100%;
        }
        #left{
            width:40%;
            height:400px;
            margin:0 auto;
            /*float:left;*/
            /* background-color: #d5d2d23b; */
            /*position: fixed;*/

        }
        #left #login{
            margin-left:25%;
            margin-top: 180px;
        }
        #left input{
            padding-left: 5px;
            width:250px;
            height:35px;
            border-radius: 10px;
            outline:none;
        }
        #left p{
            font-size: 20px;
        }
        #left  #sub{
            margin-top: 20px;
            width:260px;
            height: 40px;
            background-color: rgb(226, 148, 52);
            color: white;
            font-size: 20px;
            border:3px solid rgb(226, 148, 52);
            border-radius: 10px;
        }
        #right{
            width:60%;
            height:3000px;
            float:right;
            background-color: #d5d2d23b;
        }
        #right #one{
            height:480px;
            width:100%;
            background-color: #F3F1E7;
            /* background-color: red; */
        }
        #right #one img{
            width:250px;
            margin-left: 40px;
            margin-top:80px;
        }

    </style>
</head>
<body>
    <div id="main">
        <div id="left">
            <!-- <p style="margin:0 auto;">登录</p> -->
            <form method="post" action="/user/register" id="login">
                <h1 style="margin-left:100px;">注册</h1>
                <p>手机号码：</p>
                <input name="phone" type="num" oninput="value=value.replace(/[^\d]/g,'')" id="phone">
                <p>输入密码：</p>
                <input name="password" type="password" id="password" maxlength="10" autocomplete="off" minlength="3" ><br>
                <p>确认密码：</p>
                <input type="password" id="password2" maxlength="10" autocomplete="off" minlength="3" onkeyup="jud()"><br>
                <button id="sub">点击注册</button>
                <div id="add"></div>
                <b><a href="/user/login">前去登录</a></b>
            </form>
        </div>

0000
<!--        <div id="right">-->
<!--            <div id="one" style="float:left;">-->
<!--                <img src="../images/dog.jpg" alt="" >-->
<!--                <img src="../images/dog.jpg" alt="">-->
<!--                <img src="../images/dog.jpg" alt="">-->
<!--            </div>-->
<!--            <img src="../images/default/2.jpg" alt="" >-->
<!--            <img src="../images/dog.jpg" alt="">-->
<!--            <img src="../images/default/2.jpg" alt="">-->
<!--            <img src="../images/dog.jpg" alt="">-->
<!--        </div>-->
    </div>
</body>
<script>
    var pageHeight;
    var locate=0;
    window.onload=function(){
        pageHeight=document.body.scrollHeight;
    }
    var timer;
    timer=setInterval("scrollDown()",40); 
    function scrollDown(){
        if(locate<pageHeight){
            locate++;
            scroll(0,locate);
        }else{
            clearInterval(timer);
        }
    }

    var sub = document.getElementById('sub');
    var password = document.getElementById('password');
    var password2 = document.getElementById('password2');



    

    function jud() {
                if(password.value == password2.value) {
                    document.getElementById("add").innerHTML="<font color='green'>两次密码相同</font>";
                } else {
                    document.getElementById("add").innerHTML="<font color='red'>两次密码不相同，请重新输入</font>";
                }
            }
    
            sub.onclick = function () {
                var xhr = new XMLHttpRequest();
                var data = "username=" + username.value + "&password=" + password.value;
                xhr.onreadystatechange = function() {
                    if(xhr.readyState == 4) {
                        if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
                            var res = xhr.responseText;
                            console.log(res);
                            judge(res);
                        } else {
                            alert("request is error!!" + xhr.status);
                        }
                    }
                }
                xhr.open('post','http://192.168.1.217/RegistServlet',true);
                xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                xhr.send(data);
            }
            function judge(a) {
                if (a == "true") {
                    alert("注册成功！");
                    window.location.href = "www.baidu.com";
                } else {
                    alert("注册失败！！！");
                }
            }


    
</script>
</html>